<html>
<head>
<title>发表评价</title>
<meta charset="utf-8">
<meta name="data-spm" content="a2o23">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<style>
        *{padding: 0; margin: 0}
        #HUABAN_WIDGETS{display: none}
        html, body {
            width: 100%;
            height: 100%;
            margin: 0px;
            padding: 0px;
            font-size: 12px;
            color: #666;
            font-family: Helvetica,sans-serif;
            -webkit-tap-highlight-color: transparent;
        }
        body{
            margin: 0 auto;
            min-width: 320px;
            max-width: 640px;
        }
		.star{
			width:1.2rem;
			height:1.2rem;
			display:inline-block;
			background-repeat:no-repeat;
			background-image:url('statics/mobile/images/icon/starnormal.png');
			background-size:contain;
		}
		.active{
			background-image:url('statics/mobile/images/icon/staractive.png');
		}
</style>
<style>
html{-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
</style>
</head>
<body data-spm="8209083" style="">
<div style=" display: flex; flex-direction: column;   background-color: rgb(244, 244, 244); height: 100%;">
	
	<div style=" display: flex; flex-direction: column;   max-height: 4.26667e+11px; padding-bottom: 42.6667px;">
		
		<div style=" display: flex; flex-direction: column;  ">
			<?php foreach($goods as $k=>$v){?>
			<div style=" display: flex; -webkit-box-orient: horizontal; flex-direction: row; background-color: rgb(255, 255, 255); align-items: center; padding: 11.0933px 10.24px; -webkit-box-pack: center;">
				<img src="<?php echo $v['goods_thumb'];?>" style="width: 22.1867px; height: 22.1867px; margin-right: 10.24px;">
				<div class="goods-id" data-id="<?php echo $v['goods_id'];?>"><?php echo $v['goods_name'];?> <?php echo $v['sku_name'];?></div>
			</div>
			
			<div style=" display: flex; flex-direction: column;   background-color: rgb(231, 231, 231); height: 1px;">
			</div>
			<div style=" display: flex; flex-direction: column;   padding: 8.53333px 8.53333px 0px; background-color: rgb(255, 255, 255);">
				<textarea id="content<?php echo $v['goods_id'];?>" maxlength="500" placeholder="宝贝满足你的期待吗？说说它的优点和美中不足的地方吧" maxrows="4" style="background-color: rgb(255, 255, 255); border-color: rgb(0, 0, 0); border-width: 0px; box-sizing: border-box; color: rgb(0, 0, 0); padding: 0px; line-height: 13.6533px; font-size: 11.9467px; height: 85.3333px; outline: none; resize: none; width: 100%; -webkit-box-flex: 1;"></textarea>
				<div style=" display: flex; -webkit-box-orient: horizontal; flex-direction: row;padding: 0px; -webkit-box-flex: 1; -webkit-box-align: center; align-items: center; -webkit-box-pack: center;margin-bottom:1rem;">
					<div style="display: flex;align-items: center;margin-right:1rem;">
						<input type="radio" value="5" name="goodscomment" class="score<?php echo $v['goods_id'];?>"> 好评
					</div>
					<div style="display: flex;align-items: center;margin-right:1rem;">
						<input type="radio" value="3" name="goodscomment" class="score<?php echo $v['goods_id'];?>"> 中评
					</div>
					<div style="display: flex;align-items: center;margin-right:1rem;">
						<input type="radio" value="1" name="goodscomment" class="score<?php echo $v['goods_id'];?>"> 差评
					</div>
				</div>
			</div>
			<div style=" display: flex; flex-direction: column;  ">
				<div style=" display: flex; flex-direction: column;  ">
				</div>
			</div>
			
			
			
			<div style=" display: flex; flex-direction: column;   margin-right: 10.24px; background-color: rgb(231, 231, 231); height: 1px; margin-left: 10.24px;">
			</div>
			<div style="padding:15px;background:#fff;">
				<div id="comment<?php echo $v['goods_id'];?>_box" class="comment_box" style="display:flex">
				  <div style="border:1px dashed #666;width:60px;height:60px;font-size:3rem;font-weight:400;text-align:center;line-height:60px;" onclick="upload('comment<?php echo $v['goods_id'];?>');">+</div>
				</div>
				<div style="display: block; font-size: 0.8rem;padding-top:1rem;color: rgb(170, 171, 179);">最多能传三张图，单击图片可删除</div>
			</div>
			<div style=" display: flex; flex-direction: column;   background-color: rgb(244, 244, 244); height: 20px;">
			</div>
			<?php }?>
		</div>
		
		<div style=" display: flex; -webkit-box-orient: horizontal; flex-direction: row;   padding: 11.0933px 10.24px; background-color: rgb(255, 255, 255); -webkit-box-align: center; align-items: center; height: 35.84px;">
			<img src="https://img.alicdn.com/tps/TB1wJWCKVXXXXbaaXXXXXXXXXXX-60-60.png" style="width: 17px; height: 17px; "><span style=" display: block; flex-direction: column;  flex: 1 1 0%; font-size: 11.9467px; margin-left: 8.53333px; -webkit-box-flex: 1;">店铺评分</span>
		</div>
		<div style=" display: flex; flex-direction: column;   padding: 0px 10.24px; background-color: rgb(255, 255, 255); margin-bottom: 11.0933px; margin-top: 0px;">
			
			<div style=" display: flex; flex-direction: column;  ">
				<div style=" display: flex; -webkit-box-orient: horizontal; flex-direction: row;   height: 35.84px; -webkit-box-align: center; align-items: center;">
					<div style=" display: flex; flex-direction: column;   margin-right: 15px;">
						<span style=" display: block; flex-direction: column;   font-size: 11.9467px; color: rgb(102, 102, 102);">物流服务</span>
					</div>
					<div id="express_star" style=" display: flex; -webkit-box-orient: horizontal; flex-direction: row;align-items: center;" class="star-box">
						
							<div class="star" data-index="1"></div>
							<div class="star" data-index="2"></div>
							<div class="star" data-index="3"></div>
							<div class="star" data-index="4"></div>
							<div class="star" data-index="5"></div>
					</div>
					<div style=" display: flex; flex-direction: column;  ">
						<span style=" display: block; flex-direction: column;   font-size: 11.9467px; color: rgb(170, 171, 179);"></span>
					</div>
				</div>
			</div>
			<div style=" display: flex; flex-direction: column;  ">
				<div style=" display: flex; -webkit-box-orient: horizontal; flex-direction: row;   height: 35.84px; -webkit-box-align: center; align-items: center;">
					<div style=" display: flex; flex-direction: column;   margin-right: 15px;">
						<span style=" display: block; flex-direction: column;   font-size: 11.9467px; color: rgb(102, 102, 102);">服务态度</span>
					</div>
					<div id="service_star" style=" display: flex; -webkit-box-orient: horizontal; flex-direction: row;align-items: center;" class="star-box">
							<div class="star" data-index="1"></div>
							<div class="star" data-index="2"></div>
							<div class="star" data-index="3"></div>
							<div class="star" data-index="4"></div>
							<div class="star" data-index="5"></div>
					</div>
					<div style=" display: flex; flex-direction: column;  ">
						<span style=" display: block; flex-direction: column;   font-size: 11.9467px; color: rgb(170, 171, 179);"></span>
					</div>
				</div>
			</div>
		</div>
		<!-- empty -->
	</div>
	<button style="position: fixed;color: rgb(255, 255, 255);background-color: rgb(255, 83, 2);bottom: 0px; left: 0px;width:100%;border:0px;height:3rem;" id="submit">发表评价</button>
</div>
<script src="statics/mobile/js/dist/lib-min.js?v=2016102404"></script>
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
<div id="tempform" style="display:none;"></div>
<iframe id="tempform" name="tempform" style="display:none;"></iframe>
<script>
var id='<?php echo $id;?>';
var site_root='<?php echo API_ROOT;?>';
function upload(field){
  if($("#comment_box").children('img').length>2){
    alert('最多能传三张图，单击图片可删除');
    return false;
  }
	str='<form id="'+field+'form" target="tempform" method="post" action="'+site_root+'tool/upload.php" enctype="multipart/form-data"><input id="'+field+'" name="'+field+'" style="display: none" type="file" value=""></form>';
	$("#tempform").html(str);
	$("#"+field).click();
}
$("#tempform").on("change","input[type='file']",function(){
	$(this).parent().submit();
});
function parseFile(file){
	$("#"+file.key+"_box").prepend('<img style="width:62px;height:62px;margin-right:5px;" src="'+file.name+'">');
}
$(".comment_box").on('click','img',function(){
  if(confirm('确定删除？')){
    $(this).remove();
  }

});

$(".star-box").find('.star').click(function(){
	var i=parseInt($(this).data('index'));
	var p=$(this).parent();
	p.find('.star').removeClass('active');
	p.find('.star').each(function(index){
		if(index<i){
			$(this).addClass('active');
		}
	});
});
$("#submit").click(function(){
  data={commit:1};
  data.service_star=$("#service_star").find('.active').length;
  data.express_star=$("#express_star").find('.active').length;
  var content=[];
  var score=[];
  var goods_id=[];
  var imglist=[];
  var imgtemp=[];
  $(".goods-id").each(function(){
	gid=$(this).data('id');
	goods_id.push(gid);
	content.push($('#content'+gid).val());
	score.push($('.score'+gid+':checked').val());
	$("#comment"+gid+"_box").find('img').each(function(){
		imgtemp.push($(this).attr('src'));
	});
	imglist.push(imgtemp);
	imgtemp=[];
  });
  data.content=content;
  data.score=score;
  data.imglist=imglist;
  data.oid=id;
  data.goods_id=goods_id;
  
  $.ajax({
	  url:"?con=order&act=comment&commit=1",
	  data:JSON.stringify(data),
	  dataType:'json',
	  type:'POST',
	  success:function(result){
		if(result.status=='1'){
		  var userAgent = navigator.userAgent.toLowerCase();
		  alert('评价提交成功');
		  if(userAgent.indexOf('miniprogram')>0 || userAgent.indexOf('wechatdevtools')>0){
			  wx.miniProgram.redirectTo({
				  url:'/pages/order/index'
			  });
		  } else {
			window.location.history.go(-1);
		  }
		}
	  }
  });
});
</script>
</body>
</html>